<script type="text/javascript" src="../../libs/js/fbfriendselector/jquery.facebook.multifriend.select.js"></script> 
<script type="text/javascript">
    
    function FBFriendSelectorInit() {
      FB.api('/me', function(response) {
          jQuery("#jfmfs-container").jfmfs({ 
                                  max_selected: 10, 
                                  max_selected_message: "valgt (in {0} of {1} selected)",
                                  friend_fields: "id,name,last_name",
                                  pre_selected_friends: [],
                                  exclude_friends: [],
                                  sorter: function(a, b) {
                                    var x = a.last_name.toLowerCase();
                                    var y = b.last_name.toLowerCase();
                                    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
                                  }
                      });
                      
          jQuery("#jfmfs-container").bind("jfmfs.friendload.finished", function() { 
              window.console && console.log("finished loading!"); 
          });
          
          jQuery("#jfmfs-container").bind("jfmfs.selection.changed", function(e, data) { 
              window.console && console.log("changed", data);
              var str = "";
              var uids = "";
              var sign = "";
              var m = data.length;
              
              for(d=0; d<m; d++) {
                  str += sign + data[d].name;
                  uids += sign + data[d].id;
                  sign = ", ";
              }
              jQuery("#data_names").val(str);
              jQuery("#data_uids").val(uids);
          });                     
      });
    }
    
</script>
<style type="text/css">
    #jfmfs-friend-selector{
        width: 510px;
        background-color: white;
        height: 174px;
    }
    #jfmfs-friend-selector input {
        height: 19px;
        margin: 0 0;
        width: 117px;
    }
    #jfmfs-friend-container {
        height: 144px;
    }
    .filter-link{
        color:black;
    }
    .invite-form{
        margin: 0 auto;
        width: 487px;
    }
    #jfmfs-container{
        border-color: #f0f0f0;
        border-style: solid;
        border-width: 1px;
        padding: 3px;
    }
    .invited-table td{
        padding: 5px;
    }
    #jfmfs-max-selected-wrapper{
        font-size:9px !important;
    }
</style>
<div class="w810 mc main_bg p84t po">
<?php if($view->invited) { ?>
    <!-- <div class="man1"></div> -->

    <div class="w802 mc">
        <div class="top_bg">
            <div class="w722 mc p30t">
                <img src="<?php echo $view->config['template_url'];?>assets/img/more_friend_txt.png" alt="" />

            </div>
        </div>
        <div class="mid_bg p30t">
            <div class="w722 mc">
                <div class="w520">
                    <form method="post" class="invite-form">
                    <h3>Flott! Invitasjon til å delta i årets ritt er sendt til følgende av dine venner:</h3>                    
                    <table class="invited-table" border="0" cellpadding="0" cellspacing="0">
                        <?php foreach($view->names as $k => $name) { ?>
                        <tr>
                            <td>
                                <a href="http://www.facebook.com/profile.php?id=<?php echo $view->uids[$k];?>">
                                    <img src="http://graph.facebook.com/<?php echo $view->uids[$k];?>/picture" />
                                </a>
                            </td>
                            <td>
                                <?php echo $name;?>
                            </td>
                        </tr>
                        <?php } ?>
                    </table>
                    </form>
                    <br/><br/><strong class="bg_arrow"><a href="?action=index" class="blue">Tilbake til start</a></strong>
            </div>

        </div>
    </div>
    <div class="bottom_bg">&nbsp;</div>
</div>    

<?php } else { ?>

    
<!-- <div class="man1"></div> -->

<div class="w802 mc">
    <div class="top_bg">
        <div class="w722 mc p30t">
            <img src="<?php echo $view->config['template_url'];?>assets/img/more_friend_txt.png" alt="" />

        </div>
    </div>
    <div class="mid_bg p30t">
        <div class="w722 mc">
            <div class="w520">
                <form method="post" class="invite-form">                                        
                    
                    <?php if($view->error) { ?>
                    <h4 style="color: red;"><?php echo $view->error;?></h4>
                    <?php } ?>                    
                    <div class="bg_area" style="height:182px;">
                        <div id="jfmfs-container">LOADING...</div>                        
                    </div>
                    <h3>Skriv en personlig melding som sendes sammen med invitasjonen:</h3>
                    <div class="bg_area" style="margin-top: 10px;">
                        <input type="hidden" id="data_names" name="data[names]" value="" />
                        <input type="hidden" id="data_uids" name="data[uids]" value="" />
                        
                        <textarea id="user_text" name="data[user_text]" class="txt"></textarea>
                    </div>
                    
                    <div class="p5t">
                        <input type="image" src="<?php echo $view->config['template_url'];?>assets/img/send_btn.png" name="submit"  class="fr" />                        
                        <br style="clear:right;" />
                    </div>
                </form>
            </div>
            <br/><br/><strong class="bg_arrow"><a href="?action=index" class="blue">Tilbake til start</a></strong>
        </div>
    </div>
    <div class="bottom_bg">&nbsp;</div>
</div>    

<script type="text/javascript">   
    window.setTimeout("FBFriendSelectorInit()", 1500);
</script>
<?php } ?>

<div class="w722 mc p15t p15b">
    <p class="fl"><a href="javascript:webjs.showTOSWindow();">Betingelser for bruk</a></p>

    <!-- <p class="fr">Share: <a href="#"><img src="<?php echo $view->config['template_url'];?>assets/img/gg_plus_icon.png" alt="" /></a></p> -->

    <br style="clear:both" />
</div>

</div>